<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Test</title>
    <link rel="stylesheet" href="main.css" />
  </head>

  <body>
    <div class="wrapper">
      <div class="main">
        <div class="top-border">
          <div class="zx-img">
            <img src="./res/image/1.no-bg.png" alt="ZhenXun" class="zx-img" />
          </div>
          <div class="top-title">
            <p class="zx-title">真寻日报</p>
            <p class="zx-tip">MAHIRO NEWS</p>
          </div>
          <div class="top-date">
            <p class="top-date-week">{{data.week}}</p>
            <p class="top-date-date">{{data.date}}</p>
            <p class="top-date-cn">{{data.zh_date}}</p>
          </div>
        </div>
        <div class="one-border">
          <div class="moyu-border">
            <div class="moyu-title">
              <img src="./res/icon/fish.png" class="title-img" />摸鱼日历
            </div>
            {% for fes in data.data_festival %}
            <p class="moyu-inner">
              距离<span class="moyu-day-name">{{fes[1]}}</span>还剩<span
                class="moyu-day"
                >{{fes[0]}}</span
              >天
            </p>
            {% endfor %}
          </div>
          <div class="bili-border">
            <div class="moyu-title" style="left: 128px">
              <img src="./res/icon/bilibili.png" class="title-img" />B站热点
            </div>
            {% for s in data.data_bili %}
            <p class="bili-text">
              <img class="hot-img" src="{{s[1]}}" />{{s[0]}}
            </p>
            {% endfor %}
          </div>
        </div>
        <div class="two-border">
          <div class="moyu-title" style="left: -3px">
            <img src="./res/icon/bgm.png" class="title-img" />今日新番
          </div>
          <div class="two-border-border">
            {% for s in data.data_anime %}
            <div class="anime-border">
              <img src="{{s[1]}}" class="anime-img" />
              <p class="anime-text">{{s[0]}}</p>
            </div>
            {% endfor %}
          </div>
        </div>
        <div class="three-border">
          <div class="moyu-title" style="left: -3px">
            <img src="./res/icon/60.png" class="title-img" />60S读世界
          </div>
          <ul style="line-height: 30px; line-height: 25px; margin-left: -25px">
            {% for s in data.data_six %} {% if data.full_show %}
            <li class="full-show-text">{{s}}</li>
            {% else %}
            <li class="normal-text">{{s}}</li>
            {% endif %} {% endfor %}
          </ul>
        </div>
        <div class="four-border">
          <div class="moyu-title" style="left: -3px">
            <img src="./res/icon/it.png" class="title-img" />IT资讯
          </div>
          <ul style="line-height: 30px; line-height: 25px; margin-left: -25px">
            {% for s in data.data_it %} {% if data.full_show %}
            <li class="full-show-text">{{s}}</li>
            {% else %}
            <li class="normal-text">{{s}}</li>
            {% endif %} {% endfor %}
          </ul>
        </div>
        <div class="five-border">
          <div class="moyu-title" style="left: -3px">
            <img src="./res/icon/hitokoto.png" class="title-img" />今日一言
          </div>
          <p style="margin-top: 5px; margin-bottom: 5px">
            “{{data.data_hitokoto}}”
          </p>
        </div>
      </div>
    </div>
  </body>
</html>
